<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
        <div id="app">
            name:{{name}}<br/>
            <heima></heima>
        </div>
  <div id="bpp">
            name:{{name}}<br/>
            <heima></heima>
        </div>

<script src="./node_modules/vue/dist/vue.js"></script>
<script>
    const heima = {
        template: `<button @click='add'>我现在次数是{{info}}次{{name}},{{age}}</button>
`,
        data() {
            return {
                info: 10,
                name: "刘德华",
                age: 80
            }
        },
        methods: {
            add() {
                this.info++
            }
        }

    };
    let vm = new Vue({
        el: "#app",
        data: {
            name: "这是黑马63主组件"
        },
        components: {
            heima
        }
    })
    let vm1 = new Vue({
        el: "#bpp",
        data: {
            name: "这是黑马63主组件"
        },
        components: {
            heima
        }
    })
</script>
</body>
</html>